import { makeRequiredRule } from '../../../utils'

const label = '手机号码'
const name = 'mobile'
let i = 1
const uniqueId = () => `${name}${i++}`

const box = {
  label,
  //拖拽组件的 key
  name,
  //拖拽组件的生成规则
  rule() {
    //如果在 props 方法中需要修改 rule 的属性,需要提前在 rule 上定义对应的属性
    return {
      //生成组件的名称
      type: 'input',
      //field 自定不能重复,所以这里每次都会生成一个新的
      field: uniqueId(),
      title: label,
      props: {
        placeholder: '请输入'
      },
      update(val, rule, fApi) {
        if ('mobileAuto' in rule.props && rule.props.mobileAuto) {
          if (sessionStorage.mobile) {
            rule.value = sessionStorage.mobile
          }
        }
        if ('mobileFormat' in rule.props && rule.props.mobileFormat) {
          fApi.updateValidate(
            rule.field,
            [
              {
                validator: (_, val, d) => {
                  const reg = /^(13[0-9]|14[579]|15[0-3,5-9]|16[6]|17[0135678]|18[0-9]|19[89])\d{8}$/
                  reg.test(val) ? d() : d(true)
                },
                message: '请输入正确的手机号码',
                trigger: 'blur'
              }
            ],
            true
          )
        }
      }
    }
  },
  //拖拽组件配置项(props)的生成规则
  props() {
    return [
      //生成`checkbox`组件的`options`配置规则
      {
        type: 'input',
        field: 'formCreateTitle',
        value: label,
        title: '字段名称'
      },
      {
        type: 'input',
        field: 'placeholder',
        title: '提示文字'
      },
      makeRequiredRule(),
      {
        type: 'switch',
        field: 'mobileFormat',
        title: '校验手机号格式',
        value: false,
        options: [{ value: false }, { value: true }]
      },
      {
        type: 'switch',
        field: 'mobileAuto',
        title: '登录后自动获取',
        value: false,
        options: [{ value: false }, { value: true }]
      }
    ]
  }
}
export default box
